<template>
	<div class="lowNews">
		<div class="head">
			<div>
				{{$t("home.onSiteActivities")}}
			</div>
			<router-link to="/activity">{{$t("home.more")}}></router-link>
		</div>
		<div class="content">
			<div @click="toDetail(item.id)" class="liItem" v-for="(item,index) in dataNews">
				<p class="title"> <span :class="item.tip?'lip':'nolip'"></span>{{item.title}}</p>
				<p class="time">{{item.time}}</p>
			</div>
		</div>
	</div>
</template>


<script>
	export default {
		data: function() {
			return {
				activeName: 'first',
				dataNews: [{
					title: 'xinwen',
					content: 'asdadasdasdasdasdasd',
					time: '2000-11-21',
					img: '',
					id: 1,
					tip: true
				}, {
					title: 'xinwen2',
					content: 'asdadasqe1331dasdasdasdasd',
					time: '2000-11-22',
					img: '',
					id: 2
				}, {
					title: 'xinwen3',
					content: 'asdadwqwewqsdaccdaasdasdasdasdasd',
					time: '2000-11-21',
					img: '',
					id: 3
				}, ],
				logotext: this.$t('home.latestInformation')
			};
		},
		methods: {
			handleClick(tab) {
				this.logotext = tab.label
				// this.getInfo(tab.lable)
			},
			toDetail(rev) {
				this.$router.push({
					path: '/newsDetail',
					query: {
						id: rev
					}
				})
			},
			getInfo() {

			}

		},
	}
</script>


<style lang="scss" scoped="scoped">
	.lowNews {
		// background: #ccc;
		// min-height: 300px;

		// padding: 20px;
		.head {
			font-size: 16px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 20px;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			padding: 10px 0;
			border-bottom: 1px solid #ccc;

			a {
				font-size: 10px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
			}
		}

		.content {
			display: flex;
			flex-direction: column;

			.liItem {
				box-sizing: border-box;
				// height: 100px;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				padding: 10px 0;

				.title {
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					font-size: 16px;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;

					// line-height: 14px;
					.lip {
						height: 5px;
						width: 5px;
						background-color: red;
						border-radius: 50%;
						margin: 9px 5px;
					}
					.nolip {
						width: 15px;
					}

					
				}
				.time {
					font-size: 8px;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #CCCCCC;
					line-height: 16px;
				}
			}
		}
	}
</style>
